<div class="section">
    <!--[if !IE]>start title wrapper<![endif]-->
    <div class="title_wrapper">
        <span class="title_wrapper_top"></span>
        <div class="title_wrapper_inner">
            <span class="title_wrapper_middle"></span>
            <div class="title_wrapper_content">
                <h2 class="menu_title">Add or Update ticket</h2>
            </div>
        </div>
        <span class="title_wrapper_bottom"></span>
    </div>
    <!--[if !IE]>end title wrapper<![endif]-->
    <script type="text/javascript">
	function haclik(){
		var val = "trainid";
		if(document.getElementById(val).value == 0){
			alert("Please select a train");
			document.getElementById(val).style.border = "1px solid #F00";
			return false;
		}
	}
	</script>
    <!--[if !IE]>start section content<![endif]-->
    <div class="section_content">
        <span class="section_content_top"></span>
        
        <div class="section_content_inner">
            <div class="table_tabs_menu">
            <!--[if !IE]>start  tabs<![endif]-->
            <!--[if !IE]>end  tabs<![endif]-->

            </div>
<!--[if !IE]>start table_wrapper<![endif]-->
            <div class="table_wrapper" style="background:none;">
                <div class="table_wrapper_inner">
                    <form method="post" enctype="multipart/form-data">  
                    <table width="612" border="0">
                          <tr>
                            <td width="250"><span style="color:#F00;font-weight:bold">Select a train</span><select name="trainid" style="margin-left:5px" id="trainid">
                              <option value="0">Please select</option>
                              <?php
                                foreach($listtrain as $items){
                                    echo "<option value='".$items['train_id']."'>".$items['train_name']."</option>";
                                }
                              ?>
                            </select></td>
                            <td width="240">
                            </td>
                          </tr>
                        </table>
                      <fieldset>
                        <legend>One way</legend>
                        <a href="javascript:void(0)" onClick="AddRow('oneway')">Add row</a>
                        <table width="794" id="oneway">
                        <tr><td width="65" style="width:65px; text-align:center;">From date</td>
                        <td width="65" style="width:65px; text-align:center;">To date</td>
                        <td width="65" style="width:65px; text-align:center;">Departs</td>
                        <td width="65" style="width:65px; text-align:center;">Arrives</td>
                        <td width="65" style="width:65px; text-align:center;">Duration</td>
                        <td width="65" style="width:65px; text-align:center;">Soft Seat</td>
                        <td width="65" style="width:65px; text-align:center;">Hard Berth</td>
                        <td width="65" style="width:65px; text-align:center;">Soft berth</td>
                        <td width="93" style="width:65px; text-align:center;">Vip Berth</td>
                        <td width="70">Number</td>
                        <td width="70">Del</td>
                        </tr>
                        <tr>
                        <td><input required style="width:65px; text-align:center" class="date" name="oneway[fromdate][]"></td>
                        <td><input required style="width:65px; text-align:center" class="date" name="oneway[todate][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[departs][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[arrives][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[duration][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[softseat][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[hardberth][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[softberth][]"></td>
                        <td><input required style="width:65px; text-align:center" name="oneway[vipberth][]"></td>
                        <td><input required="required" style="width:65px; text-align:center" name="oneway[ticknum][]" /></td>
                        <td><a href="javascript:void(0);" onclick="RemoveRow(this);"><img src="<?php echo base_url(); ?>public/images/del_icon.gif" alt="Delete" title="Delete" /></a></td>
                        </tr>
                        </table>
                        </fieldset>
                        <fieldset>
                        <legend>Roundtrip</legend>
                        <a href="javascript:void(0);" onClick="AddRow('roundtrip');">Add row</a>
                        <table id="roundtrip">
                        <tr><td width="65" style="width:65px; text-align:center;">From date</td>
                        <td width="65" style="width:65px; text-align:center;">To date</td>
                        <td width="65" style="width:65px; text-align:center;">Departs</td>
                        <td width="65" style="width:65px; text-align:center;">Arrives</td>
                        <td width="65" style="width:65px; text-align:center;">Duration</td>
                        <td width="65" style="width:65px; text-align:center;">Soft Seat</td>
                        <td width="65" style="width:65px; text-align:center;">Hard Berth</td>
                        <td width="65" style="width:65px; text-align:center;">Soft berth</td>
                        <td width="93" style="width:65px; text-align:center;">Vip Berth</td>
                        <td width="70">Number</td>
                        <td width="70">Del</td>
                        </tr>
                        <tr>
                        <td><input required style="width:65px; text-align:center" class="date" name="roundtrip[fromdate][]"></td>
                        <td><input required style="width:65px; text-align:center" class="date" name="roundtrip[todate][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[departs][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[arrives][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[duration][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[softseat][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[hardberth][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[softberth][]"></td>
                        <td><input required style="width:65px; text-align:center" name="roundtrip[vipberth][]"></td>
                        <td><input required="required" style="width:65px; text-align:center" name="roundtrip[ticknum][]" /></td>
                        <td><a href="javascript:void(0);" onclick="RemoveRow(this);"><img src="<?php echo base_url(); ?>public/images/del_icon.gif" alt="Delete" title="Delete" /></a></td>
                        </tr>
                        </table>
                        </fieldset>
                        <div style="text-align:center;margin:10px 0px"><input type="submit" name="ok" onclick="return haclik()" value="Add now" /></div>
                        </form>
                        </div>
                        <script type="text/javascript">
						var links = "<?php echo base_url(); ?>";
                        function AddRow(idtable){
                        $("#"+idtable+" tr:last").after('<tr><td><input required class="date" style="width:65px; text-align:center" name="'+idtable+'[fromdate][]"></td><td><input required class="date" style="width:65px; text-align:center" name="'+idtable+'[todate][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[departs][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[arrives][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[duration][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[softseat][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[hardberth][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[softberth][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[vipberth][]"></td><td><input required style="width:65px; text-align:center" name="'+idtable+'[ticknum][]"></td><td><a href="javascript:void(0);" onClick="RemoveRow(this);"><img src="<?php echo base_url(); ?>public/images/del_icon.gif" alt="Delete" title="Delete" /></a></td></tr>');
						$(".date").datepicker({
							  changeMonth: true,
							  changeYear: true,
							  dateFormat:"yy-mm-dd"
						});
                        }
                        function RemoveRow(aelement){
                            $(aelement).parent().parent().remove();
                        }
                        $(document).ready(function(e) {
                            $( ".date" ).datepicker({
                                  changeMonth: true,
                                  changeYear: true,
                                  dateFormat:"yy-mm-dd"
                            });
                        });
                        </script>
                </div>
            </div>
            <!--[if !IE]>end table_wrapper<![endif]-->
        </div>
        <span class="section_content_bottom"></span>
    </div>
    <!--[if !IE]>end section content<![endif]-->
</div>